<template>
	<div style="height:100%;">
		<div class="contentBox">
			<wrap-head :isChangeBigWidth.sync='isChangeBigWidth'></wrap-head>
			<wrap-slide :isChangeBigWidth.sync='isChangeBigWidth' @test="test"></wrap-slide>
			
			<div class="content" v-bind:class="classToggle" v-bind:style = "{minHeight : browserHeight + 'px'}">
				<router-view></router-view>
			</div>
		</div>
	</div>
</template>

<script>
	
	import WrapHead from '@/components/public/Header'
	import WrapSlide from '@/components/public/leftNav1'
//	import {vueEle} from '@/common/js/vueBus.js'
    
	import router from '@/router/index'
	export default {
	    data() {
	      	return {
	      		data1:null,
	      		menuData:null,
				browserHeight:null,
				isChangeBigWidth:false

	      	}
	    },
	    components:{
	    		WrapHead,
	    		WrapSlide
	    },
		computed: {
            classToggle: function () {
                return {
                'isBig': this.isChangeBigWidth,
                'isSmall': !this.isChangeBigWidth,
                }
            }
        },
	    methods:{
			test:function(value){
				console.log(value,'test');
			},

	    },
	    created(){
	    	var rou=window.location.href.split('#')[1];
		    	if(rou&&rou.length<=1){
		    		this.$router.push("/degree");
		    	}
	    },
	    beforeMount(){
			var self = this;
// 			this.Axios.post('/color').then(function(res){
// 				    console.log(res.data);
// 					self.data1 = res.data;
// //					console.log(self)				
// 				}
// 			);

	    },
		mounted(){
			this.browserHeight = Math.max(document.body[ "scrollHeight" ],document.documentElement[ "scrollHeight"])-50;
			console.log(this.browserHeight,'height');
	}
	}
</script>

<style scoped>
	/*section左侧部分样式*/
	.contentBox{
		position: relative;
		min-height: -moz-calc(100% );
		min-height: -ms-calc(100%);
		min-height: -webkit-calc(100%);
		min-height: calc(100%);

	}
	/*.sidebar .fa {
		margin-right: 5px;
	}
	.sidebar .fa-circle{
		font-size: 12px;
	}
	.sidebar .topTitle {
		background-color: #eee;
		height: 56px;
		line-height: 56px;
		padding: 0 10px;
	}
	.sidebar .settings {
		color: #858885;
	}
	
	.sidebar .settings div {
		margin-bottom: 10px;
	}*/
	
	.content{	
		position: absolute;
		top: 50px;
		
		right:0;
		background-color: #ecf0f5;
	
	}
	.contentBox .isSmall{
		left: 230px;
		transition: left 0.4s ease-in-out;
	}
	.contentBox .isBig{
		left: 50px;
		transition: left 0.4s ease-in-out;
	}
	.content>div{
		padding: 15px;
	}
</style>
<style>
.contentBox .el-loading-mask {
    background-color: rgba(16, 16, 16, 0.5);
}
</style>